import  React,{Component} from 'react'


import  Header from '../../component/Header'
import SuperListView from '../../component/SuperListView/'
import { Tabs, WhiteSpace, Badge } from 'antd-mobile';
import  ImgItem from '../../component/Item/ImgItem'
import  EvaluateItem from '../../component/Item/EvaluateItem'


import axios from '../../util/axios'
import {api}  from '../../api'
import './style.scss'
function renderTabBar(props) {
    return (<div>
      {({ style }) => <div style={{ ...style, zIndex: 1 }}><Tabs.DefaultTabBar {...props} /></div>}
    </div>);
  }


class CommonList extends Component{
    constructor(props){
        super(props)
        this.state={
           tabs:[],
           tabIndex:0
        }
        this._renderItem=this._renderItem.bind(this);
        this.tabChange=this.tabChange.bind(this)
    }
  
    componentDidMount(){
        let tabs=[];
        let user=JSON.parse(sessionStorage.user)
       
        switch(this.props.match.params.id){
             case '1-2':
             tabs=[ 
                { id:1,  title: '所有',url:api.orderAllList+'&userId='+user.id,status:"所有",statusNo:5 ,toRouteName:"CommonDetails" },
                { id:2,  title: '受理',url:api.orderHandlList+'&userId='+user.id,status:"受理",statusNo:5 ,toRouteName:"CommonDetails" },
                { id:3,  title: '调度' ,url:api.orderDispatchlList+'&userId='+user.id,status:"调度",statusNo:5 ,toRouteName:"CommonDetails"},
                { id:4, title:  '执行' ,url:api.orderExecutelList+'&userId='+user.id,status:"执行",statusNo:5,toRouteName:"CommonDetails" },
                {  id:5, title: '完成' ,url:api.orderAlreadyList+'&userId='+user.id,status:"完成",statusNo:5,toRouteName:"CommonDetails"},
                {  id:6, title: '失败' ,url:api.orderFaillList+'&userId='+user.id,status:"失败",statusNo:5,toRouteName:"CommonDetails"},
              ]
             break;
             case '1-4':
             tabs=[ 
                { title: '已评价' ,url:api.evaluateAlreadyList+"&userDeptId="+user.userDeptId,status:"已评价"},
               {  title: '待评价' ,url:api.evaluateFailList+"&userDeptId="+user.userDeptId,status:"待评价"},
              ]
             break;
        }  
      
          this.setState({
            tabs
          })
          console.log("tabs--->",this.props);
    }
    _renderItem(rowData, sectionID, rowID, highlightRow){
     
     
         switch(this.props.match.params.id){
            case '1-2':
            rowData={
                id:rowData.id,
                img:require('./apply_new_car_img.png'),
                title:rowData.yongCheRen,
                startAddress:rowData.applyUseAddress,
                overAddress:rowData.applyDestination,
                routeName:'/CommonDetails'
             }
             return <ImgItem 
              
              key={`${sectionID}-${rowID}`} item={rowData} />
             case '1-4':
            rowData={
                id:rowData.id,
                img:require('./apply_new_car_img.png'),
                title:"车牌号:"+(rowData.carNum&&rowData.carNum!=''?rowData.carNum:''),
                minTitle:"驾驶员："+(rowData.userName&&rowData.userName!=''?rowData.userName:''),
                startAddress:rowData.applyUseAddress&&rowData.applyUseAddress!=''?rowData.applyUseAddress:'',
                overAddress:rowData.applyUseAddress&&rowData.applyUseAddress!=''?rowData.applyDestination:'',
                yongCheNo:rowData.yongCheNo?rowData.yongCheNo:'',
                feiyong:rowData.feiyong?rowData.feiyong:'',
                xingshiKm:rowData.xingshiKm?rowData.xingshiKm:''
             }
             return <EvaluateItem  
             typeId={this.state.tabIndex}
             key={`${sectionID}-${rowID}`} item={rowData} />
             
            
         }

    //    return <ImgItem  key={`${sectionID}-${rowID}`} item={rowData} />
    }
    tabChange(tab,index){
      this.setState({
        tabIndex:index
      })
    }
    render(){

        let tabs=this.state.tabs
        return (
            <div className="common-list">
                 <Header 
                  title="我的用车"
                   isBack={true}
                   history={this.props.history}/>
                 <div className="body">
                   <Tabs
                    tabs={tabs} 
                    onChange={this.tabChange}
                    tabBarActiveTextColor={"#1a8afa"}
                    tabBarUnderlineStyle={{borderColor:'#1a8afa'}}
                    tabBarInactiveTextColor={"#222222"}
                    //renderTabBar={props => <Tabs.DefaultTabBar {...props} page={3} />}
                  >
                      {tabs.map((item,index)=>{
                          return <SuperListView 
                           url={item.url}
                           renderItem={(this._renderItem)}
                           key={item.id+"tab_itme"}/>
                      })}
                </Tabs>
            </div>
            </div>
           
        )
    }
}

export default  CommonList